<template>
  <el-row style="margin-bottom: 30px">
    <el-col :span="22" :offset="1">
      <div class="grid-content">
        <el-row>
          <el-link class="link" :underline="false" @click="handleHref(1)">
            <el-button type="primary" size="mini" plain round>源文件</el-button>
          </el-link>
          <el-link class="link" :underline="false" @click="handleHref(2)">
            <el-button type="primary" size="mini" plain round>提交</el-button>
          </el-link>
          <el-link class="link" :underline="false" @click="handleHref(3)">
            <el-button type="primary" size="mini" plain round>分支</el-button>
          </el-link>
          <el-link class="link" :underline="false" @click="handleHref(4)">
            <el-button type="primary" size="mini" plain round>标签</el-button>
          </el-link>
          <el-link class="link" :underline="false" @click="handleHref(5)">
            <el-button type="primary" size="mini" plain round>合并请求</el-button>
          </el-link>
          <el-link class="link" :underline="false" @click="handleHref(6)">
            <el-button type="primary" size="mini" plain round>文档</el-button>
          </el-link>
          <el-link class="link" :underline="false" @click="handleHref(7)">
            <el-button type="primary" size="mini" plain round>成员</el-button>
          </el-link>
          <el-link class="link" :underline="false" @click="handleHref(8)">
            <el-button type="primary" size="mini" plain round>设置</el-button>
          </el-link>
          <el-link class="link" :underline="false" @click="handleHref(9)">
            <el-button type="primary" size="mini" plain round>SSH密钥</el-button>
          </el-link>
        </el-row>
      </div>
    </el-col>
  </el-row>
</template>

<script>
export default {
  name: 'GitNavigationigation',
  data() {
    return {
      pid: '', // 工程id
      pname: '', // 工程名
      branch: '', // 工程分支
      codeRef: ''
    };
  },
  created() {
    this.pid = this.$route.params.pid;
    this.pname = this.$route.params.projectName;
    this.branch =
      typeof this.$route.params.codeBranch === 'undefined'
        ? 'master'
        : this.$route.params.codeBranch;
    this.codeRef =
      typeof this.$route.params.codeRef === 'undefined'
        ? 'root'
        : this.$route.params.codeRef;
  },
  methods: {
    handleHref(type) {
      const pid = this.pid;
      const pname = this.pname;
      const branch = this.branch;
      const codeRef = this.codeRef;
      switch (type) {
        case 1:
          this.$router.push({
            path:
              '/git/code/' + pid + '/' + pname + '/' + branch + '/' + codeRef
          });
          break;
        case 2:
          this.$router.push({ path: '/git/commit/list/' + pname + '/' + pid });
          break;
        case 3:
          this.$router.push({ path: '/git/branch/list/' + pname + '/' + pid });
          break;
        case 4:
          this.$router.push({ path: '/git/tag/list/' + pname + '/' + pid });
          break;
        case 5:
          this.$router.push({ path: '/git/merged/list/' + pname + '/' + pid });
          break;
        case 6:
          this.$router.push({ path: '/git/wiki/list/' + pname + '/' + pid });
          break;
        case 7:
          this.$router.push({ path: '/git/member/' + pname + '/' + pid });
          break;
        case 8:
          this.$router.push({ path: '/git/webhook/' + pname + '/' + pid });
          break;
        case 9:
          this.$router.push({ path: '/git/ssh/' + pname + '/' + pid });
          break;
        default:
          this.$router.push({
            path: '/git/code/' + pid + '/' + pname + '/' + branch
          });
          break;
      }
    }
  }
};
</script>

<style scoped>
.link {
  padding-right: 10px;
}
</style>
